<template>
  <div class="pieChart">
      <el-row>
  <el-col  :span="8"><div class="grid-content bg-purple" style="padding:20px"><Radar :data="data" /></div></el-col>
  <el-col  :span="8"><div class="grid-content bg-purple-light" style="padding:20px"><pieChart2 :data="data" /></div></el-col>
  <el-col  :span="8"><div class="grid-content bg-purple" style="padding:20px"><pieChart3 :data="data" /></div></el-col>
</el-row>
  </div>
</template>
<script>

import Radar from '@/components/echarts/radarChart.vue'
import pieChart2 from '@/views/quota/echarts/pieChart/pieChart2.vue'
import pieChart3 from '@/views/quota/echarts/pieChart/pieChart3.vue'

export default {
  name:"index",
  components: { Radar, pieChart2, pieChart3 },
  data() {
    return {
      data:[],
      themeId: undefined,
      currentTabComponent: 'define',
    }
  },
  computed: {},
  watch: {},
  created() {
    this.data = JSON.parse(this.$route.query.data)
  },
  mounted() {
  },
  methods: {
    childData(data) {
      if (data.tabComponent != undefined) {
        this.currentTabComponent = data.tabComponent
      }
      if (data.themeId != undefined) {
        this.themeId = data.themeId
      }
    }

  }
}

</script>
<style lang="less">
.pieChart {
  padding: 20px 0;
   background-color: #F0F2F5;
   .chart {
    background-color: #fff;
  }
}
.demonstration {
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
}
</style>
